<template>
	<el-dialog :title="titleMap[mode]" v-model="visible" :width="1600" destroy-on-close @closed="$emit('closed')" align-center>
        <el-container>
            <el-header>
                <div class="left-panel">
                    <el-button type="primary" icon="el-icon-plus" @click="add" v-auth="'verifica.add'"></el-button>
                </div>
            </el-header>
            <el-main class="nopadding">
                <scTable ref="table" row-key="id" :apiObj="apiObj" @selectionChange="selectionChange" :params="query" stripe remoteSort remoteFilter border height="600">
                    <el-table-column width="1"></el-table-column>
                    <el-table-column type="selection" width="50" reserve-selection align="center"></el-table-column>
                    <el-table-column label="所属会议" prop="project.project_code" align="center"></el-table-column>
                    <el-table-column label="商品名称" prop="goods.goods_name" align="center"></el-table-column>
                    <el-table-column label="明细" prop="detail" align="center"></el-table-column>
                    <el-table-column label="单价" prop="price" align="center"></el-table-column>
                    <el-table-column label="数量" prop="number" align="center"></el-table-column>
                    <el-table-column label="小计" prop="total" align="center">
                        <template #default="scope">
                            {{ Number(scope.row.price) * Number(scope.row.number) }}
                        </template>
                    </el-table-column>
                    <el-table-column label="结算周期" prop="settlement" align="center">
                        <template #default="scope">
                            {{ scope.row.settlement==0?'月结':'现结' }}
                        </template>
                    </el-table-column>
                    <el-table-column label="是否结账" prop="is_checkout" align="center">
                        <template #default="scope">
                            <el-tag :type="scope.row.is_checkout==0?'danger':'primary'">{{ scope.row.is_checkout==0?'未结':'已结' }}</el-tag>
                        </template>
                    </el-table-column>
                    <el-table-column label="供应商名称" prop="supplier.supplier_name" align="center"></el-table-column>
                    <el-table-column label="关联备用金" prop="reserve_code" align="center"></el-table-column>
                    <el-table-column label="操作" align="center">
                        <template #default="scope">
                            <el-button-group>
                                <el-button text type="primary" size="small" @click="table_edit(scope.row, scope.$index)" v-auth="'cost.edit'">编辑</el-button>
                                <el-popconfirm title="确定删除吗？" @confirm="table_del(scope.row, scope.$index)">
                                    <template #reference>
                                        <el-button text type="danger" size="small" v-auth="'cost.delete'">删除</el-button>
                                    </template>
                                </el-popconfirm>
                            </el-button-group>
                        </template>
                    </el-table-column>
                </scTable>
            </el-main>
        </el-container>
		<template #footer>
			<el-button @click="visible = false">取 消</el-button>
		</template>
        <save-add v-if="dialog.save" ref="saveDialog" @success="handleSuccess" @closed="dialog.save=false"></save-add>
	</el-dialog>
</template>

<script>
import saveAdd from './verificationSave'
export default {
    components: { saveAdd },
    props:{
        query: { type: String, default: "" },
    },
	emits: ['success', 'closed'],
	data() {
		return {
			mode: "add",
			titleMap: {
				add: '选择项目',
				edit: '核销明细',
				show: '查看'
			},
			visible: false,
			isSaveing: false,
			apiObj: this.$API.project.itemcost.list,
			selection: [],
            dialog: {
				save: false,
			},
            form:{
                reserve_fund_id:"",
                project_id:"",
                project_code:"",
                project_name:"",
                project_time:"",
            },
		}
	},
	mounted() {
	},
	methods: {
		//显示
		open(mode = 'add') {
			this.mode = mode;
			this.visible = true;
			return this
		},
        projectData(data){
            this.form.reserve_fund_id = data.reserve_fund_id
            this.form.project_id = data.project_id
            this.form.project_code = data.project_code
            this.form.project_name = data.project_name
            this.form.project_time = data.project_time
        },
		//表单注入数据
		setData(data) {
            this.form.reserve_fund_id = data.id
            this.form.project_id = data.project_id
            this.form.project_code = data.project.project_code
            this.form.project_name = data.project.metting
            this.form.project_time = data.project.project_time
		},
        //搜索
		upsearch() {
			this.$refs.table.upData(this.search)
		},
        refresh(){
            for (const key in this.search) {
                this.search[key] = null;
            }
            this.$refs.table.upData(this.search)
        },
		add() {
			this.dialog.save = true
			this.$nextTick(() => {
				this.$refs.saveDialog.open('add').setDataAdd(this.form)
			})
		},
        table_edit(row){
            this.dialog.save = true
			this.$nextTick(() => {
				this.$refs.saveDialog.open('edit').setData(row)
			})
        },
        //删除
		async table_del(row) {
			var reqData = {id: row.id}
			var res = await this.$API.project.itemcost.delete.post(reqData);
			if (res.code == 1) {
                this.$refs.table.refresh()
				this.$message.success("删除成功")
			} else {
				this.$alert(res.message, "提示", {type: 'error'})
			}
		},
        // 更新客户新增
        handleSuccess(data, mode) {
			if (mode == 'add') {
				this.$refs.table.refresh()
			} else if (mode == 'edit') {
				this.$refs.table.refresh()
			}
		},
	}
}
</script>

<style></style>
